<script setup lang="ts">
import useRouteCacheStore from "@/stores/routeCache"
import TabBar from "@/components/TabBar.vue";

const keepAliveRouteNames = computed(() => {
  return useRouteCacheStore().routeCaches
})
</script>

<template>
  <VanConfigProvider>
    <NavBar />
    <router-view v-slot="{ Component, route }">
      <section class="app-wrapper">
        <keep-alive :include="keepAliveRouteNames">
          <component :is="Component" :key="route.name" />
        </keep-alive>
      </section>
    </router-view>
    <TabBar />
  </VanConfigProvider>
</template>

<style scoped>
.app-wrapper {
  width: 100%;
  position: relative;
}
</style>
